import React from 'react';
import { Card, Space, Button, Checkbox, Form, Input } from 'antd';
import LoginStyle from './LoginStyle.less';
import './LoginStyle.less';
import { addCanvas } from '@/hoc/index.js';
import { userLogin } from '@/api/login';
import { withRouter } from 'react-router-dom';
import _ from 'lodash'
const onFinishFailed = (errorInfo: any) => {
  console.log('Failed:', errorInfo);
};

function index(props: any) {
  const { history } = props;
  const onFinish = (values: any) => {
    console.log('Success:', values);
    userLogin(values).then((res: any) => {
      console.log(res, 'res');
    });
    sessionStorage.setItem('token', '王媖泽要挣钱');
    history.push('/')
  };
  return (
    <div className="box">
      <div className="card-box">
        <Card
          title="管理中心系统"
          headStyle={{
            textAlign: 'center',
            fontSize: '20px',
            fontWeight: 800,
            color: '#fff',
          }}
          bordered={false}
          style={{
            width: 400,
            borderRadius: '10px',
            background: 'rgba(0, 0, 0, 0.3)',
          }}
        >
          <Form
            name="basic"
            labelCol={{ span: 8 }}
            style={{ maxWidth: 600 }}
            initialValues={{ remember: true }}
            // 防止暴力点击
            onFinish={_.debounce(onFinish, 2000)}
            onFinishFailed={onFinishFailed}
            autoComplete="off"
          >
            <Form.Item name="username" rules={[{ message: '请输入账号' }]}>
              <Input />
            </Form.Item>

            <Form.Item
              name="Password"
              rules={[{ required: true, message: '请输入密码' }]}
            >
              <Input.Password />
            </Form.Item>

            <Form.Item
              name="verify_code"
              rules={[{ required: true, message: '请输入验证码' }]}
            >
              <Space>
                <Input />
                <img
                  src="http://fangadmin.shbwyz.com/login/verfiy.html"
                  alt=""
                />
              </Space>
            </Form.Item>

            <Form.Item>
              <Button
                type="primary"
                htmlType="submit"
                style={{ width: '100%' }}
              >
                登陆
              </Button>
            </Form.Item>
          </Form>
        </Card>
      </div>
    </div>
  );
}
// 
export default addCanvas(withRouter(index));
